<template>
  <el-table-column
    v-if="column.index"
    key="type"
    :align="column.align || 'center'"
    :label="column.label || '序号'"
    type="index"
    :width="column.width"
    v-bind="column"
  />
  <el-table-column
    v-else-if="column.selection"
    key="selection"
    type="selection"
    :align="column.align || 'center'"
    :width="column.width"
    v-bind="column"
  />

  <el-table-column
    v-else
    :key="column.prop"
    :show-overflow-tooltip="!column.notooltip"
    :label="column.label"
    :align="column.align || 'center'"
    :width="column.width"
    :prop="column.prop"
    :sortable="column.sortable"
    :min-width="column.minWidth"
    v-bind="column"
  >
    <template v-if="column.children">
      <Column v-for="subColumn in column.children" :key="subColumn.prop" :column="subColumn" childs />
    </template>

    <template v-if="!column.children" #default="scope">
      <templateSlot v-if="nodeTemplate" :template="nodeTemplate" :data="scope" :row="scope.row" />
    </template>
  </el-table-column>
</template>

<script lang="ts" setup>
import { getRootComponent } from "./tool"
import { getCurrentInstance, computed } from "vue"
import templateSlot from "./template.vue"
defineOptions({
  name: "Column"
})
const props = defineProps({
  column: {
    type: Object,
    default: () => {
      return {
        prop: "",
        label: "",
        sortable: false
      }
    }
  }
})
const column: any = computed({
  get: () => {
    return props.column
  },
  set: (val) => {
    return val
  }
})

//获取根节点
const leeTable = getRootComponent(getCurrentInstance())
//根节点slots
const parentSlots: any = leeTable?.slots
//获取当前列对应slots
const nodeTemplate = parentSlots[column.value.prop] as any
</script>
